<template>
	<view>
		<table>
			<tr>
				<th colspan="3">今日数据</th>
			</tr>
			<tr>
				<td>进件单数</td>
				<td>发起支付单数</td>
				<td>付款单数</td>
			</tr>
			<tr v-if="list[0]">
				<td>{{list[0].JJDS}}</td>
				<td>{{list[0].FQZFDS}}</td>
				<td>{{list[0].FKDS}}</td>
			</tr>
			<tr>
				<td>转化率</td>
				<td>退款单数</td>
				<td>佣金收入</td>
			</tr>
			<tr v-if="list[0]">
				<td>{{ zeroTwo((list[0].JJDS==0?0:list[0].FKDS/list[0].JJDS)*100)+'%'}}</td>
				<td>{{list[0].TKDS}}</td>
				<td>{{ zeroTwo(list[0].YJSR)}}</td>
			</tr>
			<tr style="background-color: aliceblue;">
				<th colspan="3" style="padding: 2px;" />
			</tr>
			<tr>
				<th colspan="3">本周数据</th>
			</tr>
			<tr>
				<td>进件单数</td>
				<td>发起支付单数</td>
				<td>付款单数</td>
			</tr>
			<tr v-if="list[1]">
				<td>{{list[1].JJDS}}</td>
				<td>{{list[1].FQZFDS}}</td>
				<td>{{list[1].FKDS}}</td>
			</tr>
			<tr>
				<td>转化率</td>
				<td>退款单数</td>
				<td>佣金收入</td>
			</tr>
			<tr v-if="list[1]">
				<td>{{ zeroTwo((list[1].JJDS==0?0:list[1].FKDS/list[1].JJDS)*100)+'%'}}</td>
				<td>{{list[1].TKDS}}</td>
				<td>{{zeroTwo(list[1].YJSR)}}</td>
			</tr>
			<tr style="background-color: aliceblue;">
				<th colspan="3" style="padding: 2px;" />
			</tr>
			<tr>
				<th colspan="3">本月数据</th>
			</tr>
			<tr>
				<td>进件单数</td>
				<td>发起支付单数</td>
				<td>付款单数</td>
			</tr>
			<tr v-if="list[2]">
				<td>{{list[2].JJDS}}</td>
				<td>{{list[2].FQZFDS}}</td>
				<td>{{list[2].FKDS}}</td>
			</tr>
			<tr>
				<td>转化率</td>
				<td>退款单数</td>
				<td>佣金收入</td>
			</tr>
			<tr v-if="list[2]">
				<td> {{ zeroTwo( (list[2].JJDS==0?0:list[2].FKDS/list[2].JJDS)*100) + '%'}}</td>
				<td>{{list[2].TKDS}}</td>
				<td>{{ zeroTwo(list[2].YJSR)}}</td>
			</tr>

		</table>
	</view>
</template>

<script>
	import {
		statistic
	} from '@/api/jinjian.js'

	export default {
		name: "dataAnalyse",
		data() {
			return {
				list: []
			}
		},
		props: {
			productId: {
				required: true,
				type: String
			}
		},
		mounted() {
			statistic(this.productId).then(res => {
				if (res.code == 200) {
					this.list = res.data
				}
			})
		}
	}
</script>

<style>
	table {
		background-color: #fff;
		width: 99%;
		border-radius: 4px;
		margin: 2px auto;
	}

	td {
		padding: 3px;
		text-align: center;
	}
</style>